@charset "UTF-8";
body {
  background-color: #dbdde0;
  font-family: "微软雅黑";
}

.header {
  background-color: #333333;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 120px;
  width: 100%;
}

.header .part-one {
  height: 63px;
  margin-left: 100px;
}

.header .part-two {
  height: 50px;
  width: 90%;
  display: flex;
  margin-left: 120px;
  justify-content: space-between;
  background-color: #222222;
}

.header .part-two p {
  font-weight: lighter;
  color: white;
  margin: 10px;
  letter-spacing: 3px;
}

.header .part-two .right {
  display: flex;
  flex-direction: row;
}

.header .part-two .left {
  display: flex;
  flex-direction: row;
}

.bac {
  background-color: #dbdde0;
  height: 1000px;
  width: 100%;
}

.bac .body {
  display: flex;
  justify-content: space-between;
  margin-left: 100px;
  margin-right: 30px;
  height: 100%;
  margin-top: 20px;
  margin-top: 0.1vw solid #333;
  background-color: white;
}

.bac .body .left {
  width: 22%;
  display: flex;
  align-items: flex-start;
  font-family: "微软雅黑";
  text-align: right;
  flex-direction: column;
}

.bac .body .left .one {
  margin-top: 20px;
  line-height: 0%;
  color: white;
  background-color: red;
  width: 180px;
}

.bac .body .left .one .one1 {
  font-weight: bolder;
}

.bac .body .left .one .one2 {
  font-weight: lighter;
}

.bac .body .left .two {
  margin-top: 300px;
  line-height: 0%;
  color: white;
  background-color: red;
  width: 180px;
}

.bac .body .left .two .two1 {
  font-weight: bolder;
}

.bac .body .left .two .two2 {
  font-weight: lighter;
}

.bac .body .middle {
  width: 60%;
  height: 800px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: 30px;
}

.bac .body .middle .up {
  margin-top: 20px;
  display: flex;
  height: 347px;
  flex-direction: row;
  justify-content: space-between;
  text-align: center;
}

.bac .body .middle .up .one {
  border: 1px solid #AAAAAA;
  margin-right: 10px;
  height: 243px;
}

.bac .body .middle .up .two {
  border: 1px solid #AAAAAA;
  margin-right: 10px;
  height: 243px;
}

.bac .body .middle .up .three {
  border: 1px solid #AAAAAA;
  margin-right: 10px;
  height: 243px;
}

.bac .body .bottom {
  display: flex;
  height: 635px;
  flex-direction: row;
  justify-content: space-between;
}

.bac .body .bottom .left {
  height: 620px;
  width: 48%;
  flex-direction: row;
  flex-wrap: wrap;
}

.bac .body .bottom .right {
  height: 620px;
  width: 48%;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.bac .right {
  display: flex;
  width: 25%;
  align-items: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  background-color: #dbdde0;
}

.bac .right .two {
  margin-left: 18px;
}

.bac .right .three {
  margin-left: 18px;
}

.bac .right .one {
  flex-wrap: nowrap;
  height: 20px;
  font-weight: bolder;
  font-size: 17px;
  margin-left: 18px;
}

.bac .right .one .p {
  flex-wrap: nowrap;
}

.bac .right .pic1 {
  margin-left: 20px;
  display: flex;
  flex-direction: row;
  width: 198px;
  height: 85px;
  justify-content: space-around;
}

.bac .right .pic2 {
  display: flex;
  flex-direction: row;
  width: 188px;
  height: 160px;
  justify-content: space-around;
  margin-left: 20px;
}

.bac .right .pic2 p1 {
  display: flex;
  flex-direction: column;
}
